<?xml version="1.0" encoding="UTF-8"?>
<f:view xmlns="http://www.w3.org/1999/xhtml" 
	xmlns:aui="http://liferay.com/faces/aui"
	xmlns:c="http://java.sun.com/jsp/jstl/core" 
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html" 
	xmlns:bridge="http://liferay.com/faces/bridge"
	xmlns:p="http://primefaces.org/ui" 
	xmlns:example-cc="http://java.sun.com/jsf/composite/example-cc"
	xmlns:ui="http://java.sun.com/jsf/facelets">
	
	<h:head />
	<h:body>
		<p:dialog id="customerDialog" header="Kunden und Adressen" widgetVar="customerDlg" 
				modal="true" height="500" width="1200" draggable="false" resizable="false" >
		    <p:dataTable id="customerTable" styleClass="electroOfficeTable"
		    			 var="customer" value="#{customerListController.customers}"
		    			 selectionMode="single"
		    			 selection="#{appointmentFormController.selectedAddress}"
		   				 rowKey="#{customer.customerId}"
		                 paginator="true" rows="10"
		                 paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
		                 rowsPerPageTemplate="5,10,15,25,50"  
		                 filteredValue="#{customerListController.filteredCustomers}"
		                 widgetVar="customerListWidget"
		                 emptyMessage="Keine Kunden gefunden"
		                 currentPageReportTemplate="Seite {currentPage} von {totalPages}" >
					
		       <f:facet id="headerFacet" name="header">
		        	<p:toolbar id="tableFacetPanel" >
		        		<p:toolbarGroup align="left">
			        		<p:commandButton value="Übernehmen" />
			        	</p:toolbarGroup>
			        	<p:toolbarGroup align="right">
			                <h:panelGroup styleClass="searchFieldPanel" >
			                	<h:outputText value="Suche" />  
			                	<p:inputText id="globalFilter" onkeyup="customerListWidget.filter()" style="width:150px" /> 					   		                 
			            	</h:panelGroup>
		            	</p:toolbarGroup>
		             </p:toolbar>
		        </f:facet>
				
	        	<p:column headerText="Messerli ID" width="80px" 
	        			sortBy="#{customer.customerId}" 
	        			filterBy="#{customer.customerId}"
	        			filterMatchMode="contains"
	        			id="customerId" >
	        		<h:outputText value="#{customer.customerId}" />
		        </p:column>
		        <p:column headerText="Anrede" width="80px"
	        			sortBy="#{customer.salutation}" 
	        			filterBy="#{customer.salutation}"
	        			filterMatchMode="contains" 
	        			id="salutation" >
	        		<h:outputText value="#{customer.salutation}" />
		        </p:column>
				<p:column headerText="Nachname" width="80px"
	        			sortBy="#{customer.lastname}" 
	        			filterBy="#{customer.lastname}"
	        			filterMatchMode="contains" 
	        			id="lastname" >
	        		<h:outputText value="#{customer.lastname}" />
		        </p:column>
		        <p:column headerText="Vorname" 
	        			sortBy="#{customer.firstname}" 
	        			filterBy="#{customer.firstname}"
	        			filterMatchMode="contains" 
	        			id="firstname" >
	        		<h:outputText value="#{customer.firstname}" />
		        </p:column>
		        <p:column headerText="Strasse" 
	        			sortBy="#{customer.street}" 
	        			filterBy="#{customer.street}"
	        			filterMatchMode="contains" 
	        			id="street" >
	        		<h:outputText value="#{customer.street}" />
		        </p:column>
		        <p:column headerText="PLZ" 
	        			sortBy="#{customer.plz}" 
	        			filterBy="#{customer.plz}"
	        			filterMatchMode="contains" 
	        			id="plz" >
	        		<h:outputText value="#{customer.plz}" />
		        </p:column>
		        <p:column headerText="Ort" 
	        			sortBy="#{customer.city}" 
	        			filterBy="#{customer.city}"
	        			filterMatchMode="contains" 
	        			id="city" >
        			<h:outputText value="#{customer.city}" />
		        </p:column>
		    </p:dataTable>
		    <h:panelGroup styleClass="buttonsSaveDelete">
				<p:commandButton value="Speichern" 
							actionListener="#{appointmentFormController.addresses}"  
							styleClass="electroOffice-button save-button" 
							ajax="false"
							update="appointmentForm"
							disabled="!appointmentFormController.oneAddressSelected" />
			</h:panelGroup> 
		</p:dialog>
	</h:body>
</f:view>